<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<title>提交订单</title>
		<link rel="stylesheet" type="text/css" href="../css/aui.css"/>
        <link rel="stylesheet" type="text/css" href="../css/api.css"/>
		<style>
			body {
				background-color: rgb(242,242,242)
			}
            .aui-bar{
                background-color: #6ac82c;
            }
			.title{
				overflow: hidden;
				padding: 15px 0;
				border-bottom: 1px solid #dfdfdf;
				background-color: #fff;
			}
			.center-info {
			}
			.center-info .name-phone {
				color: #333;
			}
			.center-info .name-phone span {
				margin-left: 30px;
			}
			.center-info p {
				margin-top: 10px;
			}
			.left-icon {
				padding: 0 10px;
			}
			.left-icon .aui-iconfont {
				font-size: 22px;
				color: #6ac82c;
				line-height: 55px;
			}
			.right-icon {
				padding: 0 10px;
			}
			.right-icon .aui-iconfont {
				font-size: 22px;
				color: #ccc;
				line-height: 55px;
			}
			.content {
				display: -webkit-box;
				display: box;
				padding: 12px;
				margin: 15px 0;
				border-top: 1px solid #dfdfdf;
				border-bottom: 1px solid #dfdfdf;
				background-color: #fff;
			}
			.content img {
				-webkit-box-flex: 1;
				box-flex: 1;
				max-width: 80px;
				display: block;
			}
			.content .right-coontent {
				-webkit-box-flex: 1;
				box-flex: 1;
			}
			.right-coontent {
				padding-left: 10px;
			}
			.right-coontent .right-coontent-title {
				margin: 5px 0;
			}
			.right-coontent p {
				margin-top: 15px;
				font-size: 18px;
				color: #ff4040;
			}
			.right-coontent p span {
				float: right;
				font-size: 14px;
				text-align: right;
				line-height: 27px;
			}
			.list-view {
				background-color: #fff;
				border-top: 1px solid #dfdfdf;
			}
			.list-view li {
				height: 55px;
				border-bottom: 1px solid #dfdfdf;
				line-height: 55px;
				padding: 0 15px;
			}
			.list-item .aui-pull-left {
				color: #666;
			}
			.list-item .aui-pull-right {
				color: #333;
			}
			.list-item .aui-pull-right div {
				float: right;
			}
			.aui-radio {
				float: right;
				margin:15px 10px;
				line-height: 22px;
			}
			.aui-radio:checked {
				background-color: #409ee1;
				border-color: #409ee1;
			}
            .aui-radio:checked:before,.aui-radio:checked:after{
                top: 1px;
            }
            .footer {
				width: 100%;
				position: fixed;
				left: 0;
				bottom: 0;
				border-top:1px solid #dfdfdf;
                background-color: #fff;
			}
			.footer .aui-pull-right div{display:inline-block;}
			.footer .aui-pull-right .btn {
				line-height: 42px;
				background: #409ee1;
				width:85px;
				text-align:center;
				color:#fff;
				margin-left:15px;
			}
			.footer .aui-pull-right .pay span{
				color:#ff4040;
			}
		</style>
	</head>
	<body>
    <div id="top-div"></div>
    <header id="header" class="aui-bar aui-bar-nav">
        <a href="javascript:;" onclick="javascript:window.location.href='../html/frame_tab_3.html'" class="aui-pull-left"> <span class="aui-iconfont aui-icon-left"></span> </a>
        <div id="header-title" class="aui-title">
            购物车
        </div>
    </header>
		<div class="title" onclick="openAddInfo()">
			<div class="left-icon aui-pull-left">
				<span class="aui-iconfont aui-icon-locationfill"></span>
			</div>
			<div class="center-info aui-pull-left">
				<div class="name-phone">
					刘先生<span>13579246810</span>
				</div>
				<p class="address">
					四川省成都市 青羊区文殊院街66号
				</p>
			</div>
			<div class="right-icon aui-pull-right">
				<span class="aui-iconfont aui-icon-right"></span>
			</div>
		</div>
		<div class="content">
			<img src="../image/img1.png" />
			<div class="right-coontent">
				<span class="right-coontent-title">香甜红富士水果 最新采摘</span>
				<p>
					￥10<span>x1</span>
				</p>
			</div>
		</div>
		<ul class="list-view">
			<li class="list-item">
				<div class="aui-pull-left">
					商品总额
				</div>
				<div class="aui-pull-right">
					￥199.5
				</div>
			</li>
			<li class="list-item">
				<div class="aui-pull-left">
					配送方式
				</div>
				<div class="aui-pull-right">
					<div>
						好农配送
					</div>
					<input class="aui-radio" type="radio" name="radio" />
				</div>
			</li>
			<li class="list-item">
				<div class="aui-pull-right">
					<div>
						上门自提
					</div>
					<input class="aui-radio" type="radio" name="radio" />
				</div>
			</li>
		</ul>
		<footer class="footer">
			<div class="aui-pull-right">
				<div class="pay">
					合计：<span>￥199.5</span>
				</div>
				<div class="btn" onclick="openPayWin()">
					提交订单
				</div>
			</div>
		</footer>
	</body>
	<script type="text/javascript" src="../script/api.js"></script>
	<script type="text/javascript">
		function openPayWin(){
            window.location.href = '../html/pay.html'
		}
		function openAddInfo(){
            window.location.href = '../html/add_info.html'
		}
	</script>
</html>